<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>
<html>
	 <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
        <meta name="format-detection" content="telephone=no">
        <meta charset="UTF-8">
        <meta name="description" content="Violate Responsive Admin Template">
        <meta name="keywords" content="Super Admin, Admin, Template, Bootstrap">
        <link href="<%=path %>/assets2/js/bootstrap-table.css" rel="stylesheet">
        <script src="<%=path %>/assets2/js/jquery-1.11.1.min.js"></script>
        <script src="<%=path %>/assets2/js/bootstrap-table.js"></script>
   		<script src="<%=path %>/assets2/js/locale/bootstrap-table-zh-CN.js"></script>
   		<script src="<%=path%>/assets2/js/moment-with-locales.min.js"></script>
   		<script src="<%=path%>/assets2/js/bootstrap-datetimepicker.min.js"></script>
		<link rel="stylesheet" href="<%=path%>/assets2/js/bootstrap-datetimepicker.min.css">
		<script src="<%=path %>/assets2/js/validation/validate.min.js"></script>
        <script src="<%=path %>/assets2/js/validation/validationEngine.min.js"></script>
        <script src="<%=path %>/assets2/js/validation/messages_zh.min.js"></script>
        <script src="<%=path %>/assets2/js/jquery.form.js"></script>
        <script src="<%=path %>/assets2/js/bootstrap.min.js"></script>
    </head>
<div class="row">
	<ol class="breadcrumb">
		<li><a href="<%=path%>/index"><span
				class="glyphicon glyphicon-home"></span></a></li>
		<li class="active">供应商订单管理</li>
	</ol>
</div>

<div class="panel panel-default">
	<div class="panel-heading">订单列表</div>
	<div class="panel-body">
		<form id="formSearch" class="form-horizontal">
			<input type="hidden" id="orderStatus" name="orderStatus" value="3">
			<div class="form-group" style="margin-top: 15px">
				<label class="control-label col-sm-1" for="goodsName">订单号码</label>
				<div class="col-sm-2">
					<input type="text" class="form-control" name="orderNo">
				</div>
				<label class="control-label col-sm-1" for="goodsName">商品名称</label>
				<div class="col-sm-2">
					<input type="text" class="form-control" name="goodsName">
				</div>
				<label class="control-label col-sm-1" for="goodsName">客户姓名</label>
				<div class="col-sm-2">
					<input type="text" class="form-control" name="userName">
				</div>
				<label class="control-label col-sm-1" for="goodsName">客户电话</label>
				<div class="col-sm-2">
					<input type="text" class="form-control" name="userPhone">
				</div>
			</div>

			<div class="form-group" style="margin-top: 15px">
				<label class="control-label col-sm-1" for="goodsName">起始时间</label>
				<div class="col-sm-2">
					<div class='input-group date' id='datetimepicker1' style="">
						<input type='text' class="form-control" id="startTime"
							name="startTime" /> <span class="input-group-addon"
							style="cursor: pointer;"> <span
							class="glyphicon glyphicon-calendar"></span>
						</span>
					</div>
					<!-- <input type="text" class="form-control" name="serachGoodsName" > -->
				</div>
				<label class="control-label col-sm-1" for="goodsName">结束时间</label>
				<div class="col-sm-2">
					<div class='input-group date' id='datetimepicker2'>
						<input type='text' class="form-control" id="endTime"
							name="endTime" /> <span class="input-group-addon"
							style="cursor: pointer;"> <span
							class="glyphicon glyphicon-calendar"></span>
						</span>
					</div>
				</div>
				<div class="col-sm-1" style="text-align: left;">
					<button type="button" style="margin-left: 50px" id="btn_query"
						class="btn btn-primary" onclick="getPage()">查询</button>
				</div>
			</div>
		</form>
		<br>
		<div class="tab-wrapper tab-primary">
			<ul class="nav nav-tabs">
				<!-- <li class=""><a href="#profile1"
					onclick="$('#orderStatus').val(1);currentPage=1;getPage();" data-toggle="tab">未付款</a></li> -->
				<li class="active"><a href="#profile2"
					onclick="$('#orderStatus').val(3);currentPage=1;getPage();" data-toggle="tab">已付款未发货</a></li>
				<li class=""><a href="#profile3"
					onclick="$('#orderStatus').val(4);currentPage=1;getPage();" data-toggle="tab">已付款已发货</a></li>
				<li class=""><a href="#profile4"
					onclick="$('#orderStatus').val(5);currentPage=1;getPage();" data-toggle="tab">已完成</a></li>
				<!-- <li class=""><a href="#profile5"
					onclick="$('#orderStatus').val(2);currentPage=1;getPage();" data-toggle="tab">已取消订单</a></li> -->
			</ul>
			<button style="float: right; margin-right: 40px; margin-top: -40px"
				onclick="getPage()" class="btn btn-default" type="button" title="刷新">
				<i class="glyphicon glyphicon-refresh icon-refresh"></i>
			</button>
		</div>
		<div id="orderDivId"></div>
	</div>
</div>
   <div class="modal fade" tabindex="-1" role="dialog" id="sendOrderModal">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title">订单发货</h4>
			</div>
			<div class="modal-body">
				 <form role="form" class="form-validation" id="sendOrderFm" action="<%=path %>/supplier/sendOrder" method="post">
				 	<input type="hidden" id="sendOrderId" name="orderId">
				 	<div class="row">
						<div class="col-md-12 form-group">
							<label>快递单号</label> <input type="text"
								class="input-sm validate[required] form-control" name="orderunique">
						</div>
					</div>
					<button class="btn btn-sm" type="button" id="sendOrderDiv">提交</button>
				 </form>
			</div>
		</div>
		<!-- /.modal-content -->
	 </div>
	 <!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
   <div class="modal fade" tabindex="-1" role="dialog" id="getOrderModal">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title">订单收货</h4>
			</div>
			<div class="modal-body">
				<form role="form" class="form-validation" id="getOrderFm" action="<%=path %>/web/getOrder" method="post">
				 	<input type="hidden" id="getOrderId" name="orderId">
				 	<div class="row">
						<div class="col-md-12 form-group">
							<label>收货码</label> <input type="text"
								class="input-sm validate[required] form-control" name="userGetCode">
						</div>
					</div>
					<button class="btn btn-sm" type="button" onclick="getOrderSub()">提交</button>
				 </form>
			</div>
		</div>
		<!-- /.modal-content -->
	 </div>
	 <!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
   <script type="text/javascript">
   (function(){
		if($("[class*='form-validation']")[0]) {
		    $("[class*='form-validation']").validationEngine();
		    $('body').on('click', '.validation-clear', function(e){
			e.preventDefault();
			$(this).closest('form').validationEngine('hide');
		    });
		}
	})();
   var pageSize=1;
   var currentPage=1;
    $(function(){
    	pageSize=15;
    	currentPage=1;
    	//日期选择
	    var picker1 = $('#datetimepicker1').datetimepicker({  
	        format: 'YYYY-MM-DD',  
	        locale: moment.locale('zh-cn'),  
	    });  
	    var picker2 = $('#datetimepicker2').datetimepicker({  
	        format: 'YYYY-MM-DD',  
	        locale: moment.locale('zh-cn')  
	    });  
	    //动态设置最小值  
	    picker1.on('dp.change', function (e) {  
	        picker2.data('DateTimePicker').minDate(e.date);  
	    });  
	    //动态设置最大值  
	    picker2.on('dp.change', function (e) {  
	        picker1.data('DateTimePicker').maxDate(e.date);  
	    });
    	getPage();
    	$('#sendOrderDiv').bind('click',function(){
    		sendOrderSub();
    	})
    })
    
    //发货
    function sendOrderSub(){
			if($("#sendOrderFm").validationEngine("validate")){
				$('#sendOrderFm').ajaxSubmit({
					success:function(data) { 
					if(data.state==1){
						swal({ 
							  title: "操作成功", 
							  text: "发货成功", 
							  type: "success",
							},
							function(){
								$('#sendOrderModal').modal('toggle');
								getPage();
							});
					}else{
						swal({ 
							  title: "操作失败", 
							  text: "发货失败", 
							  type: "error",
							},function(){
								$('#sendOrderDiv').on("click",function(){
									sendOrderSub();
								})
							});
					}
				}
				})
			}
		}	
    function getOrderSub(){
		if($("#getOrderFm").validationEngine("validate")){
			$('#getOrderFm').ajaxSubmit(function(data) { 
				if(data.state==1){
					swal({ 
						  title: "操作成功", 
						  text: "收货成功", 
						  type: "success",
						},
						function(){
							$('#getOrderModal').modal('toggle');
							getPage();
						});
				}else if(data.state==2){
					swal({ 
						  title: "操作失败", 
						  text: "收货失败，收货码不正确", 
						  type: "error",
						});
				}else{
					swal({ 
						  title: "操作失败", 
						  text: "收货失败", 
						  type: "error",
						});
				}
			})
		}
	}
   		function getPage(){
   			var totalPage=1;
   			var sumCount=1;
   			var interval=5;
   			$.ajax({
   	            type:"POST",
   	            url: "<%=path%>/supplier/getSupplierOrderList?offset="+currentPage+"&limit="+pageSize,
   	            data: $('#formSearch').serialize(),
   	            dataType: "json",
   	            success: function(data,status,xhr){
   				list =data.list;
   				sumCount=data.totalCount;
   				if (sumCount > 0){
   					totalPage = Math.ceil((sumCount) / pageSize);
   				}else{
   					totalPage = 0;
   				}
   				var list=data.list;
   				var divStr="<div class='panel'>";
   				for(var l=0;l<list.length;l++){
   					divStr+="<div class='alert bg-info' style='background-color:#87CEFF;'><div class='row'>";
   					divStr+="<div class='col-md-1 text-center'>订单号码</div><div class='col-md-2'>"+list[l].orderNo+"</div>"
   					divStr+="<div class='col-md-1 text-center'>客户姓名</div><div class='col-md-2'>"+list[l].userName+"</div>"
   					divStr+="<div class='col-md-1 text-center'>客户电话</div><div class='col-md-2'>"+list[l].userPhone+"</div>"
   					divStr+="<div class='col-md-1 text-center'>订单价格</div><div class='col-md-1'>"+list[l].orderPrice+"</div>"
   				
					if(list[l].orderStatus==3){
	   					divStr+="<div class='col-md-1 text-center'><button type='button' class='btn btn-sm btn-success' onclick='$(\"#sendOrderId\").val("+list[l].orderId+");$(\"#sendOrderModal\").modal(\"show\");'>发货</button></div>"
	   					divStr+="</div><div class='row'><div class='col-md-1 text-center'><label>创建时间</label></div><div class='col-md-2'>"+list[l].createDate+"</div>"
	   					divStr+="<div class='col-md-1 text-center'><label>收货地址</label></div><div class='col-md-6'>"+list[l].userAddress+"</div></div>"
					}else if(list[l].orderStatus==4){
	   					divStr+="<div class='col-md-1 text-center'><button type='button' class='btn btn-sm btn-success' onclick='alert(\"待开发\")'>物流信息</button></div>"
	   					divStr+="</div><div class='row'><div class='col-md-1 text-center'><label>创建时间</label></div><div class='col-md-2'>"+list[l].createDate+"</div>"
	   					divStr+="<div class='col-md-1 text-center'><label>收货地址</label></div><div class='col-md-5'>"+list[l].userAddress+"</div>"
	   					divStr+="<div class='col-md-1 text-center'><label>快递单号</label></div><div class='col-md-2'>"+list[l].orderunique+"</div></div>"
					}else if(list[l].orderStatus==1||list[l].orderStatus==2||list[l].orderStatus==6||list[l].orderStatus==5){
						divStr+="</div><div class='row'><div class='col-md-1 text-center'><label>创建时间</label></div><div class='col-md-2'>"+list[l].createDate+"</div>"
	   					divStr+="<div class='col-md-1 text-center'><label>收货地址</label></div><div class='col-md-6'>"+list[l].userAddress+"</div></div>"
					}
   					divStr+="</div>"
   					var goods=list[l].goods;
   					for(var x=0;x<goods.length;x++){
   						divStr+='<div class="panel-body"><div class="row"><div class="col-md-1">';
   						divStr+='<img class="img-responsive" src="<%=path%>/supplier/getApplyPhoto?photoUrl='+goods[x].supplierGoodsThums+'">';
   						divStr+='</div><div class="col-md-11"><div class="row"><div class="col-md-3">'+goods[x].supplierGoodsName+'</div><div class="col-md-2 text-right">数量：'+goods[x].goodsCount+'</div><div class="col-md-2 text-left">价格：'+goods[x].supplierGoodsPrice+'</div></div>';
   						divStr+='</div></div></div></div>';
   					}
   				}
   				divStr+='</div></div>';
   	            //获得页码
   	            var pageStr="<div class='row'><div class='col-xs-6'><div class='dataTables_info'>共 1 到 "+totalPage+" 页 "+sumCount+" 条数据</div></div><div class='col-xs-6'>";
   	            pageStr=pageStr+"<div class='dataTables_paginate paging_simple_numbers'><ul class='pagination'>";
   	            if(currentPage!=1 && totalPage!=0){
   					  pageStr=pageStr+"<li class='paginate_button previous' onclick='currentPage=1;getPage();'><a href='#'>首页</a></li>";
   				}
   	       
   				//计算页码显示个数
   				var start=parseInt(currentPage-interval/2)+1;
   				var end=parseInt(currentPage+interval/2);
   				if(totalPage <= interval){
   					start = 1;
   					end = totalPage;
   				}else{
   					if(currentPage-interval/2<0){
   						start = 1;
   						end = interval;
   					}
   					if(currentPage+interval/2>totalPage){
   						start = totalPage-interval+1;
   						end = totalPage;
   					}
   				}
   				for(var i=start;i<=end;i++){
   		        	 if(i==currentPage){
   		        		 pageStr=pageStr+'<li class=\'paginate_button active\'><a href=\'#\'>'+i+'</a></li>'; 
   		        	 }else{
   		        		 pageStr=pageStr+'<li class=\'paginate_button\' onclick="currentPage='+(i)+';getPage();"><a href=\'#\'>'+i+'</a></li>'; 
   		        	 }
   	            }
   	            if(currentPage!=totalPage && totalPage!=0){
   					  pageStr=pageStr+"<li class='paginate_button next' onclick='currentPage=totalPage;getPage();'><a href='#'>尾页</a></li></ul></div>";
   				}
   	             pageStr=pageStr+"</div></div>";
   	             $('#orderDivId').html(divStr+pageStr);
   	            }
   			});
   		}
   </script>
</html>